<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:c="http://java.sun.com/jsp/jstl/core">
    <h:head>
        <title>Perfil de Usuario </title>

        <script src="./jQuery/js/jquery-latest.pack.js" type="text/javascript"></script>
        <script src="./jQuery/js/jcarousellite_1.0.1c4.js" type="text/javascript"></script>
        <script src="./jQuery/js/jquery-1.4.4.min.js" type="text/javascript"></script>


           <script language="javascript" type="text/javascript" >
           function validarEmail() {
               var valor = document.getElementById("j_idt24:correo").value;
                if ((/[\w-\.]{3,}@([\w-]{2,}\.)*([\w-]{2,}\.)[\w-]{2,4}/.test(valor)) ){
                        alert("La dirección de email " + valor + " es correcta.")
                        return (true)
                } else {
                        alert("La dirección de email es incorrecta.");
                        return (false);
                }
            }
        </script>

        <style>
           body {
                width: 960px;
                margin: 40px auto;
                height:100%;
                font-size:14px;
                color:black;
                font-family:Arial, Helvetica, sans-serif;
                background-color: #708090;
            }
        </style>


    </h:head>
    <h:body>

        <p:growl autoUpdate="true" showDetail="true" id="actualizapag"/>
        <h:form>
            <p:panel id="paneld" header="#{msg.i_user}" >
                <table>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.nickname}: "/> 
                    </td>
                    <td>
                    <h:outputText value="#{userLog.username}"/> 
                    </td>
                    </tr>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.email}: "/> 
                    </td>
                    <td>   
                    <h:outputText value="#{userLog.correo}"/> 
                    </td>
                    </tr>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.nombre}: "/> 
                    </td>
                    <td>
                    <h:outputText value="#{userLog.nombre}"/> 
                    </td>
                    </tr>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.apellidos}: "/> 
                    </td>
                    <td>
                    <h:outputText value="#{userLog.apellidos}"/> 
                    </td>
                    </tr>
                </table> 
                <p:commandButton value="#{msg.e_perfil}" action="obtenerInfo-flow" onclick="pnel.show()" type="button"/>
                <p:commandButton value="Cambiar Contraseña" action="cambiar" onclick="passwd.show()" type="button"/>
            </p:panel>
        </h:form>

        <h:form onsubmit="return validarEmail()" >
            <p:panel visible="false" widgetVar="pnel" closeTitle="true" header="#{msg.p_ed}" >
                <table>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.nickname}: "/> 
                    </td>
                    <td>
                    <h:inputText id="nickA" value="#{Aactualizar.username}" readonly="true" /> 
                    </td>
                    </tr>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.email}: "/> 
                    </td>
                    <td>   
                    <h:inputText id="correo" value="#{Aactualizar.correo}" readonly="false" /> 
                    </td>
                    </tr>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.nombre}: "/> 
                    </td>
                    <td>
                    <h:inputText id="nombreA" value="#{Aactualizar.nombre}" readonly="false" /> 
                    </td>
                    </tr>
                    <tr>
                        <td>
                    <h:outputText value="#{msg.apellidos}: "/> 
                    </td>
                    <td>
                    <h:inputText id="apellidosA" value="#{Aactualizar.apellidos}" readonly="false" /> 
                    </td>
                    </tr>
                </table> 
                <p:commandButton value="#{msg.g_cambios}" action="irguardarUsuarios" onclick="pnel.hide()" ajax="false" update="actualizapag" /> 
            </p:panel>
        </h:form>





        <h:form>
            <p:panel visible="false" widgetVar="passwd" closeTitle="true" header="#{msg.p_ed}">
                #{msg.contrasena} actual:*<h:inputSecret value="#{usuarioControlador.user}" id="password" required="true" label="password"/>
               <!--  <p:commandButton value="comprobar" action="cambiar" ajax="false" update="actualizapag"/>  -->
                nuevo #{msg.contrasena}:*<h:inputSecret value="#{usuarioControlador.pass1}"  required="true" label="password"/>
                repita nuevo #{msg.contrasena}:*<h:inputSecret value="#{usuarioControlador.pass2}"  required="true" label="password"/>
                <p:commandButton value="cambiar contrasena" action="cambiar" ajax="false" update="actualizapag"/>
            </p:panel>
        </h:form>




        <h:outputLink value="/index.html">#{msg.inicio}</h:outputLink>
    </h:body>
</html>
